<template>
  <div class="app-container">
    <iframe src="https://www.czy3d.com/sample/hql/mes/?title=0" width="100%" height="100%" frameborder="0"></iframe>
    <!-- <div class="app-container-left">
      左侧内容
      <div class="app-container-left-chart"></div>
    </div> -->
  </div>
</template>
  
<script>
export default {
  name: 'Charts',
  components: {
    // 注册组件
  },
  data() {
    return {
      // 数据
    };
  },
  methods: {
    // 方法
  }
};
</script>

<style scoped>
/* ::v-deep.el-table th.el-table__cell.is-leaf {
  border-bottom: none;
}
::v-deep.el-table td.el-table__cell {
  border-bottom: none;
}
::v-deep.el-table .el-table__header-wrapper th {
  background-color: transparent !important;
}
::v-deep.el-table::before {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0px;
} */
</style>
<style lang="scss" scoped>
.app-container {
  display: flex;
  background-color: #e3e4e9;
  padding: 0;
  height: 80vh;
  position: relative;
  iframe{
    position: absolute;
    width: 100%;
    height: 100%;
  }
  &-left{
    width: 400px;
    height: 100%;
    margin-right: 15px;
    background-image: url('../../../../assets/images/dv/left-bg.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index: 99;
    &-chart{
      width: 100%;
      height: 100%;
      background-image: url('../../../../assets/images/dv/left-echart.png');
      background-size: 100% 100%;
      background-repeat: no-repeat;
    }
  }
  &-right{
    flex: 1;
    height: 100%;
    
  }
}
</style>